<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <title>详情页</title>
    <link rel="stylesheet" type="text/css" href="__PUBLIC__/Css/semantic.css"/>
    <link rel="stylesheet" type="text/css" href="__PUBLIC__/Css/common.css">
    <link rel="stylesheet" type="text/css" href="__PUBLIC__/Css/main.css">
    <!-- <script src="__PUBLIC__/Js/flickity-docs.min.js"></script> -->
</head>
<style>
    body{
        background-color: #fff;
    }
    .or-box1 {
        border-top:1px solid  #c9cbcb;
        overflow:hidden;
        padding:0px 5px;
        position: fixed;
        bottom: 40px;
        z-index: 2;
        background-color: #fff;
    }
    .or-box1 div{
       
        float: left;
    }
    .sbox1{
        width: 45%;
    }
    .gouwu{
        width: 55%;
        margin-top: 11px;
    }
    .xq{
        position: relative;
        display: block;
    }
    .xq:before{
    content: "";
    position: absolute;
    width: 70px;
    height: 1px;
    background-color: #a0a0a0;
    top:10px;
    left:70px;
}
.xq:after{
    content: "";
    position: absolute;
    width: 70px;
    height: 1px;
    background-color: #a0a0a0;
    top:10px;
    right:70px;
}
.banner img{
    width: 100%;
}
    @media (max-width: 375px){
        .sbox1{
        width: 39%;
    }
    .gouwu{
        width: 61%;
        margin-top: 10px;
    }
}
@media (max-width: 320px){
     .sbox1{
        width: 42%;
    }
    .gouwu{
        width: 58%;
        margin-top: 10px;
    }
    .gw,.gm{
        padding: 10px !important;
    }
}

</style>
<body>
<form name="form3" method="post" action="__URL__/gouwuAC">
    <div class="pusher">

        <!--       <div class="banner">
                  <div class="de-img">
                   <img src="{$prs['img']}" alt="img" class="half-img">
                  </div>
         -->        </div>
    <div class="hero-gallery js-flickity">
        <div class="hero-gallery__cell hero-gallery__cell--1">
            <div class="content-wrap">
                <img src="{$prs['img']}" alt="img" class="half-img">
            </div>
        </div>
<!--         <div class="hero-gallery__cell hero-gallery__cell--2">
            <div class="content-wrap">
                <img src="{$prs['img']}" alt="img" class="half-img">
            </div>
        </div>
        <div class="hero-gallery__cell hero-gallery__cell--3">
            <div class="content-wrap">
                <img src="{$prs['img']}" alt="img" class="half-img">
            </div>
        </div> -->

    </div><!-- 幻灯片   end -->

    <div class="goods-info" style="margin-top:0;">
        <div class="or-box">
            <h4>产品名称: {$prs.name}</h4>
            <div class="danjia">
                <span style="font-size: 16px;font-weight: 600;color: #bb3a34">&yen; {$prs.money}</span>  
                <span style="width: 30px;height: 30px;float: right;margin-top: -26px">
                    <!-- <img src="__PUBLIC__/Images/index/fenxiang.png" alt=""> -->
                    <!-- <p style="color: #64676b">分享</p> -->
                </span>   
            </div>
        </div>
        <div class="goods-xiangqing" style="text-align: center;background-color: #f2f2f1;padding: 10px 0">
           
            
            <span style="color: #a0a0a0;width: 20%;margin: auto" class="xq"><img src="__PUBLIC__/Images/index/xiangqing.png" alt=""  style="margin-top: 3px;float: left;margin-right: 5%;margin-left: 20%"><span style="float: left;font-size: 12px;">详情</span>
            <div style="clear: both"></div>
            </span>
            
        </div>
        <div class="goods-info">
            <div class="ui inverted vertical masthead white segment">
      <!--           <div class="title">
                    <p>产品详情</p>
                </div> -->
                <div class="banner">
                    {$prs['content']}
                </div>
            </div>

        </div>
        <div class="or-box or-box1">
            <div class="sbox sbox1" >
            <ul>
                <li>
                    <div class="Spinner">
                        <input type="button" value="-" class="jian" />
                        <span class="shuliang">0</span>
                        <input type="button" value="+" class="jia" />
                    </div><br>
                    <div class="danjia" style="display: none;">售价：<span>{$prs.money}元</span>
                    <eq name="prs['is_dz']" value="1">
                        &nbsp;&nbsp;折后价：<span style="color: #f00;display: none; ">{$prs['dazhe']}</span>元
                        <else/>
                        &nbsp;&nbsp;<span style="color: #f00;display: none; ">{$prs['money']}</span>
                    </eq>
                    </div><br>
                    <div class="zongji">小计：<span>{$prs.money}元</span></div>

                </li>
            </ul>
        </div>

            <div class="gouwu">
                <input type="submit" name="action" value="加入购物车" onclick="{if(confirm('确定加入购物车吗?')){return true;}return false;}" class="ui red basic button gw" style="float: left;color: #b13a33 !important;border-color:  #b13a33;padding: 10px">
                <input type="submit" name="action" value="立即购买" onclick="{if(confirm('确定立即购买吗?')){return true;}return false;}" class="ui orange button gm" style="float: left;background:#b13a33;padding: 10px ">
            &nbsp;&nbsp;
               
                <input name="pid" type="hidden" class="ipt"  id="UserCode" value="{$rs.id}"/>
                <input name="id" type="hidden" class="ipt"  id="id" value="{$prs.id}"/>
                <input name="cptype" type="hidden" class="ipt"  id="cptype" value="{$prs.cptype}"/>
                <input name="nums" type="hidden" class="ipt"  id="nums" value=""/>
            </div>
            
        </div>
    </div>

    
</form>

<script>
    var oUl=document.getElementsByTagName('ul')[0];
    var aLi=oUl.getElementsByTagName('li');
    var aEm=document.getElementsByTagName('em');
    var goodsnum=document.getElementById("nums");
    console.log(goodsnum);
    var oStrong=document.getElementsByTagName('strong')[0];
    var total=0;
    var countprice=0;
    var max=0;
    for (var i = 0; i < aLi.length; i++) {
        shop(aLi[i]);
        shop2(aLi[i]);
    };

        function shop2(obj){
        var aInp=obj.getElementsByTagName('input');
        var aSpan=obj.getElementsByTagName('span');
        var num=parseInt(aSpan[0].innerHTML);
        var price=parseFloat(aSpan[2].innerHTML);
            aSpan[0].innerHTML=num;
            goodsnum.value=num;
            aSpan[3].innerHTML=num*price+'元';
            total--;
            countprice-=price;
            aEm[0].innerHTML=total;
            oStrong.innerHTML=countprice;
            setmax();
        }

    function shop(obj){
        var aInp=obj.getElementsByTagName('input');
        var aSpan=obj.getElementsByTagName('span');
        var num=parseInt(aSpan[0].innerHTML);
        var price=parseFloat(aSpan[2].innerHTML);
        aInp[0].onclick=function(){
            if(num<=0)return;
            num--;
            aSpan[0].innerHTML=num;
            goodsnum.value=num;
            aSpan[3].innerHTML=num*price+'元';
            total--;
            countprice-=price;
            aEm[0].innerHTML=total;
            oStrong.innerHTML=countprice;
            setmax();


        }
        aInp[1].onclick=function(){
            num++;
            aSpan[0].innerHTML=num;
            goodsnum.value=num;
            aSpan[3].innerHTML=num*price+'元';
            total++;
            countprice+=price;
            aEm[0].innerHTML=total;
            oStrong.innerHTML=countprice;
            setmax();
        }

    }
    function setmax(){
        max=0;
        for (var i = 0; i < aLi.length; i++) {
            var aSpan=aLi[i].getElementsByTagName('span');
            if(aSpan[0].innerHTML>0){
                if(max<parseFloat(aSpan[2].innerHTML)){
                    max=parseFloat(aSpan[2].innerHTML);
                }
            }
            aEm[1].innerHTML=max;
        }



    }
</script>
<div style="height:70px;background-color:#fff;"></div>
<include file="Public:footer" />